<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
	<title>test</title>
	<link rel="stylesheet" type="text/css" href="../css/aui.css">
	<link rel="stylesheet" type="text/css" href="../css/aui-flex.css">
	<style type="text/css">
		.order {
			background: #ffffff;
			padding-bottom: 10px;
		}
		.order-info  {
			font-size: 0.875em;
			width: 100%;
		}
		.order-info span {
			color: #333;
			margin-right: 5px;
		}
		.order-info time {
			color: #999999;
		}
		.order-info i.aui-iconfont {
			color: #999;
			font-size: 0.875em;
		}
		.order-icon img {
			width: 80%;
			border-radius: 5px;
		}
		.order-title {
			font-size: 1em;
			color: #333;
			padding-bottom: 10px;
			margin-bottom: 10px;
		}
		.order-title > i.aui-iconfont {
			font-size: 0.87em;
			color: #999999;
		}
		p.goods-list {
			font-size: 0.75em;
			color: #999;
			margin-bottom: 10px;
		}
		p.count-info {
			font-size: 0.75em;
			color: #666666;
			padding-bottom: 5px;
		}
		p.count-info span {
			margin: 0 5px;
		}
		p.count-info strong {
			color: #333333;
			font-size: 0.875em;
			font-weight: 700;
		}
		.btn {
			margin: 5px;
		}
		.btn .aui-btn {
			font-size: 0.75em;
		}
		.btn .aui-btn:first-child {
			margin-right: 10px;
		}
		.aui-border-b:after {
			border-color: #ddd;
		}
	</style>
</head>
<body >
	<section class="aui-content order">
		<div class="aui-flex-col order-info aui-padded-10">
			<div class="aui-flex-item-12">
				<span>订单已完成</span>
				<time>2016-04-12 12:00:00</time>
				<i class="aui-iconfont aui-icon-delete aui-pull-right"></i>
			</div>
		</div>
		<div class="aui-flex-col">
			<div class="aui-flex-item-2 order-icon aui-text-right aui-padded-5">
				<img src="../image/demo1.png" />
			</div>
			<div class="aui-flex-item-10 aui-padded-5">
				<p class="order-title aui-border-b">民生街朝天锅 <i class="aui-iconfont aui-icon-right"></i></p>
				<p class="goods-list">
					葱段
					<em class="aui-pull-right">× 1</em>
				</p>
				<p class="goods-list">
					葱段
					<em class="aui-pull-right">× 1</em>
				</p>
				<p class="goods-list">
					葱段
					<em class="aui-pull-right">× 1</em>
				</p>
				<p class="aui-text-right aui-border-b count-info">
					共<span>5</span>份，实付<strong>￥16.00</strong>
				</p>
			</div>
		</div>
		<div class="aui-flex-col btn">
			<div class="aui-flex-item-12 aui-text-right">
				<div class="aui-btn aui-btn-outlined aui-btn-info">再来一单</div>
				<div class="aui-btn aui-btn-outlined aui-btn-warning">评价得1600积分</div>
			</div>
		</div>
	</section>
	<section class="aui-content order">
		<div class="aui-flex-col order-info aui-padded-10">
			<div class="aui-flex-item-12">
				<span>订单已完成</span>
				<time>2016-04-12 12:00:00</time>
				<i class="aui-iconfont aui-icon-delete aui-pull-right"></i>
			</div>
		</div>
		<div class="aui-flex-col">
			<div class="aui-flex-item-2 order-icon aui-text-right aui-padded-5">
				<img src="../image/demo1.png" />
			</div>
			<div class="aui-flex-item-10 aui-padded-5">
				<p class="order-title aui-border-b">民生街朝天锅 <i class="aui-iconfont aui-icon-right"></i></p>
				<p class="goods-list">
					葱段
					<em class="aui-pull-right">× 1</em>
				</p>
				<p class="goods-list">
					葱段
					<em class="aui-pull-right">× 1</em>
				</p>
				<p class="goods-list">
					葱段
					<em class="aui-pull-right">× 1</em>
				</p>
				<p class="aui-text-right aui-border-b count-info">
					共<span>5</span>份，实付<strong>￥16.00</strong>
				</p>
			</div>
		</div>
		<div class="aui-flex-col btn">
			<div class="aui-flex-item-12 aui-text-right">
				<div class="aui-btn aui-btn-outlined aui-btn-info">再来一单</div>
				<div class="aui-btn aui-btn-outlined aui-btn-warning">评价得1600积分</div>
			</div>
		</div>
	</section>
	<section class="aui-content order">
		<div class="aui-flex-col order-info aui-padded-10">
			<div class="aui-flex-item-12">
				<span>订单已完成</span>
				<time>2016-04-12 12:00:00</time>
				<i class="aui-iconfont aui-icon-delete aui-pull-right"></i>
			</div>
		</div>
		<div class="aui-flex-col">
			<div class="aui-flex-item-2 order-icon aui-text-right aui-padded-5">
				<img src="../image/demo1.png" />
			</div>
			<div class="aui-flex-item-10 aui-padded-5">
				<p class="order-title aui-border-b">民生街朝天锅 <i class="aui-iconfont aui-icon-right"></i></p>
				<p class="goods-list">
					葱段
					<em class="aui-pull-right">× 1</em>
				</p>
				<p class="goods-list">
					葱段
					<em class="aui-pull-right">× 1</em>
				</p>
				<p class="goods-list">
					葱段
					<em class="aui-pull-right">× 1</em>
				</p>
				<p class="aui-text-right aui-border-b count-info">
					共<span>5</span>份，实付<strong>￥16.00</strong>
				</p>
			</div>
		</div>
		<div class="aui-flex-col btn">
			<div class="aui-flex-item-12 aui-text-right">
				<div class="aui-btn aui-btn-outlined aui-btn-info">再来一单</div>
				<div class="aui-btn aui-btn-outlined aui-btn-warning">评价得1600积分</div>
			</div>
		</div>
	</section>
<body>
</html>